<template>
  <div class="m-formb1">
    <div class="m-topb1">
      <div class="tab" :class="{on: actIdx === 0}" @click="actIdx = 0">设备1</div>
      <div class="tab" :class="{on: actIdx === 1}" @click="actIdx = 1">设备2</div>
      <div class="tab" :class="{on: actIdx === 2}" @click="actIdx = 2">设备3</div>
      <div class="add"><span>+</span>新建</div>
    </div>
    <div class="box">
      <div class="left">
        <div class="gp">
          <div class="label">设备名称</div>
          <div class="inpbox">
            <input type="text" class="inp" />
          </div>
        </div>
       
        <div class="gpbox">
          <div class="gp">
            <div class="label">设备编码</div>
            <div class="inpbox">
              <input type="text" class="inp" value="山东100110" disabled />
            </div>
          </div>
          <div class="gp">
            <div class="label">设备IMEI</div>
            <div class="inpbox">
              <input type="text" class="inp" value="13012345678" disabled />
            </div>
          </div>
        </div>
        <div class="gpbox">
          <div class="gp">
            <div class="label">设备系版本</div>
            <div class="inpbox">
              <input type="text" class="inp" value="1.0.0" disabled />
            </div>
          </div>
          <div class="gp">
            <div class="label">联系电话</div>
            <div class="inpbox">
              <input type="text" class="inp" value="13012345678" disabled />
            </div>
          </div>
        </div>
        <div class="gpbox">
          <div class="gp">
            <div class="label">设备厂商</div>
            <div class="inpbox">
              <input type="text" class="inp" value="山东某公司" disabled />
            </div>
          </div>
         
        </div>
        <div class="gp">
          <div class="label">设备简介</div>
          <div class="inpbox">
            <textarea class="textarea inp" v-model="area"></textarea>
          </div>
        </div>
      </div>
      
    </div>
    <div class="bot">
      <div class="btns">
        <div class="btn">取消</div>
        <div class="btn btn1">确定</div>
      </div>
    </div>
  </div>
</template>

<script setup>
import { reactive, ref, onMounted } from 'vue';
import { message } from 'ant-design-vue';

function getImageUrl (name) {
  return new URL(`../assets/images/${name}`, import.meta.url).href;
}


const actIdx = ref(0);

const area = '青岛XX养殖场,成立于2000年,主要从事肉牛的养殖与销售业务,自成立以来一直保持着良好的发展态势,坚持"顾客至上"的发展理念';


</script>

<style>
</style>